<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2018/8/4
  Time: 17:41
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>注册页面</title>
    <link rel="stylesheet" type="text/css" href="layui/css/layui.css"/>
    <script type="text/javascript" src="layui/layui.all.js"></script>
    <script type="text/javascript" src="jquery-1.9.1.js"></script>
    <link rel="stylesheet" type="text/css" href="registered.css"/>
</head>
<body>
<div class="bg_image">
    <form action="/registeduser" class="con" method="post">
        <h2 class="registed">注册</h2>
        <div class="username">
            <h3 style="color: white" class="layui-icon layui-icon-username">用户名:</h3>
            <input type="text" placeholder="请输入用户名" name="username" class="usertext" autocomplete="off"/>
            <h3 class="message1"></h3>
        </div>
        <div class="password">
            <h3 style="color: white" class="layui-icon layui-icon-password">密码:&nbsp;&nbsp;&nbsp;</h3>
            <input type="text" placeholder="请输入密码" name="userpassword" class="userpwd" autocomplete="off"/>
            <h3 class="message3"></h3>
        </div>
        <div class="e-mail">
            <h3 style="color: white" class="layui-icon layui-icon-login-weibo">邮箱:&nbsp;&nbsp;&nbsp;</h3>
            <input type="email" placeholder="请输入邮箱" name="usermail" class="usermail" autocomplete="off"/>
            <h3 class="message2"></h3>
        </div>
        <div class="submit">
            <button  class="layui-btn layui-btn-normal layui-bg-cyan" id="submit">提交</button>
            <button  type="reset" class="layui-btn layui-btn-warm layui-bg-cyan">重置</button>
        </div>
    </form>
</div>
</body>
<script type="text/javascript">
    $(function () {
        $(".usertext").keyup(function () {
            $.ajax({
                "url": "/checkuser",
                "type": "Post",
                "data": {"username": $(".usertext").val()},
                "datatype": "json"
            }).done(
                function (data) {
                    $(".message1").html(data.message);
                    if ("该用户已存在!" === data.message) {
                        $("#submit").attr("disabled", "disabled");
                    } else {
                        $("#submit").removeAttr("disabled");
                    }
                }
            ).fail(
            )
        });
        $(".userpwd").blur(function () {
            var userPasssword = $(".userpwd").val();
            if (userPasssword.length !== 0) {
                $(".message3").html("");
                $("#submit").removeAttr("disabled");
            } else {
                $(".message3").html("密码不能为空!");
                $("#submit").attr("disabled", "disabled");
            }
        });
        $(".usermail").keyup(function () {
            var email = $(".usermail").val();
            var checkEmail = /^[1-9]\d{5,10}@(qq|163).com$/;
            if (email.match(checkEmail)) {
                $(".message2").html("邮箱可以使用!");
                $("#submit").removeAttr("disabled");
            } else {
                $(".message2").html("邮箱格式不合法!");
                $("#submit").attr("disabled", "disabled");
            }
        });
        $("#submit").click(judgeForm())
        function judgeForm() {
            var uAttr = $(".username").val();
            console.log('uAttr=' + uAttr)
            var pAttr = $(".password").val();
            console.log('pAttr=' + pAttr);
            var mAttr = $(".e-mail").val();
            console.log('mAttr=' + mAttr);
            $(".con").form = function () {
                console.log("hello")
                if (uAttr == "" || pAttr == "" || mAttr=="") {
                    return false;
                } else {
                    return true;
                }
            }
        }
    });
</script>
</html>
